<!--  -->
<template>
  <div class=''>
    <basic-container>
      <avue-crud
        ref="crud"
        :page.sync="page"
        :search.sync="searchForm"
        :data="tableData"
        :table-loading="tableLoading"
        :option="tableOptions"
        @on-load="getList"
        @size-change="sizeChange"
        @current-change="currentChange"
        @search-change="searchChange"
        @search-reset='searchReset'
        @refresh-change='refreshChange'
      >
        <template
          slot-scope="scope"
          slot="advertisingTypeSearch"
        >
          <el-select v-model="searchForm.advertisingType">
            <el-option
              v-for="(item,index) in optionsList"
              :key="index"
              :value="item.value"
              :label="item.label"
            ></el-option>
          </el-select>
        </template>
        <template
          slot-scope="scope"
          slot="searchMenu"
        >
          <el-button
            size="small"
            icon="el-icon-download"
            @click="ExportFile"
          >导出</el-button>
        </template>
      </avue-crud>
    </basic-container>
  </div>
</template>

<script>
// 这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
// 例如：import 《组件名称》 from '《组件路径》';
import { AdvOptions } from '@/const/crud/datareport/lease'
import { AdvPage } from '@/api/datareport/index'
import { getDicType, ExportFile } from '@/api/common'
export default {
  // import引入的组件需要注入到对象中才能使用
  components: {},
  data () {
    // 这里存放数据
    return {
      searchForm: {
        advertisingType: ''
      },
      optionsList: [],
      tableData: [],
      tableLoading: false,
      tableOptions: AdvOptions,
      page: {
        total: 0, // 总页数
        currentPage: 1, // 当前页数
        pageSize: 20 // 每页显示多少条
      },
      exportForm: {}
    }
  },
  // 监听属性 类似于data概念
  computed: {},
  // 监控data中的数据变化
  watch: {},
  // 方法集合
  methods: {
    getList (page, params) {
      AdvPage(Object.assign({
        current: this.page.currentPage,
        size: this.page.pageSize
      }, params, this.searchForm)).then(response => {
        this.changeShouColumn()
        this.tableData = response.data.data.records
        this.page.total = response.data.data.total
        this.tableLoading = false
      }).catch(() => {
        this.tableLoading = false
      })
    },
    sizeChange (pageSize) {
      this.page.pageSize = pageSize
    },
    currentChange (current) {
      this.page.currentPage = current
    },
    searchChange (form, done) {
      this.exportForm = form
      this.page.currentPage = 1
      this.getList(this.page, form)
      done()
    },
    refreshChange () {
      this.getList(this.page)
    },
    searchReset () {
      // this.searchForm.advertisingType = this.optionsList[0].value
      this.exportForm = {}
      this.searchForm.advertisingType = ''
      this.getList()
    },
    changeShouColumn () {
      // if (this.searchForm.advertisingType == 0) {
      //   this.tableOptions.column[4].hide = true
      //   this.tableOptions.column[5].hide = true
      //   this.tableOptions.column[6].hide = true
      // } else {
      this.tableOptions.column[4].hide = false
      this.tableOptions.column[5].hide = false
      this.tableOptions.column[6].hide = false
      // }
    },
    ExportFile () {
      this.exportForm.type = '0'
      ExportFile('/statistics/ledger/export/adv', Object.assign({}, this.exportForm, this.searchForm))
    }
  },
  // 生命周期 - 创建完成（可以访问当前this实例）
  created () {

  },
  // 生命周期 - 挂载完成（可以访问DOM元素）
  mounted () {
    getDicType('advertising_type').then(res => {
      this.optionsList = res.data.data
      // this.searchForm.advertisingType = this.optionsList[0].value
    })
  },
  beforeCreate () { }, // 生命周期 - 创建之前
  beforeMount () { }, // 生命周期 - 挂载之前
  beforeUpdate () { }, // 生命周期 - 更新之前
  updated () { }, // 生命周期 - 更新之后
  beforeDestroy () { }, // 生命周期 - 销毁之前
  destroyed () { }, // 生命周期 - 销毁完成
  activated () { } // 如果页面有keep-alive缓存功能，这个函数会触发
}
</script>
<style lang='scss' scoped>
//@import url(); 引入公共css类
</style>